<template>
	<view class="content">
		<view class="mianBody">
			<p class="time">{{time}}</p>
			<itemFile v-for="(item,index) in listCard" :item='item' :key="index" color='#fff'
				:class="index==2?'cardtop':''">
				<view class="soltValue" v-if='index==2'>
					<u-line></u-line>
					<p class="total" style="font-weight: bold;">合计（净重）：<span>{{total}}</span>kg</p>
					<p class="total" style="color:#999999; ">每个空桶重4.3kg</p>
					<view style="margin-top:28rpx" class="edict-button">
					</view>
					<u-line></u-line>
					<p class="total" style="color:#999999;text-align: left;">
						<span style="font-size: 30rpx;">交接人</span>
						<span style="font-size: 30rpx;color: black;margin-left: 40rpx;">{{jjr}}</span>
					</p>
				</view>
				<u-line v-if="index==1"></u-line>
			</itemFile>
			<view class="qianzBox" v-if="qzdz">
				<view class="tit">电子签章</view>
				<view class="qzImg">
					<image :src="qzdz" mode=""></image>
				</view>
			</view>
			<view class="fouter flex-ac" v-if="showData">
				<view style="flex: 1;">
					<!-- <u-button type="primary" color="#999999" :plain="true" text="作废"  @click.stop='remove()'></u-button> -->
					<view class="zuofei flexmid" @click.stop='remove()'>作废</view>
				</view>
				<view style="width: 490rpx;">
					<!-- <u-button type="primary" color="#3DB020" text="编辑"   @click.stop='edict()'></u-button> -->
					<view class="bianji flexmid" @click.stop='edict()'>编辑</view>
				</view>

			</view> 
		</view>
	</view>
</template>

<script>
	// 两种状态收运都用这个（）
	import {
		detailValue,
		invalid
	} from '../../utils/api.js'
	export default {
		data() {
			return {
				time:'',
				jjr:'',
				showData:false,
				qzdz:'',
				total: '',
				listCard: [{
						title: '',
						id:'',
						cardId:'',
						child: [{
								width: '100%',
								title: '收运记录单号',
								mark: ''
							},
							{
								width: '100%',
								title: '客户简称',
								mark: ''
							},
							{
								width: '50%%',
								title: '客户地址',
								mark: ''
							},
						]
					}, {
						title: '感染性医疗废物（kg)(841-001-01)',
						child: [{
								width: '50%',
								title: '桶数',
								mark: ''
							},
							{
								width: '50%',
								title: '毛重',
								mark: ''
							},
							{
								width: '50%',
								title: '净重',
								mark: ''
							},
						]
					},
					{
						title: '损伤性医疗废物（kg)(841-002-01)',
						child: [{
								width: '50%',
								title: '桶数',
								mark: ''
							},
							{
								width: '50%',
								title: '毛重',
								mark: ''
							},
							{
								width: '50%',
								title: '净重',
								mark: ''
							},
						]
					}
				]
			}
		},
		onLoad(options) {
			this.cardId=options.id
			console.log('options：', options)
			if(options.show=='true'){
				this.showData=true
			}else{
				this.showData=false
			}
			this.qzdz = uni.getStorageSync("qzdz")
		},
		onShow() {
			setTimeout(()=>{
				detailValue({
					id: this.cardId
				}).then(res => {
				    this.time=res.data.createTime
				    this.listCard[0].title=res.data.mdcInstitutionName
						this.listCard[0].id=res.data.id
						this.listCard[0].child[0].mark=res.data.serialNo
						this.listCard[0].child[1].mark=res.data.mdcInstitutionShortName
						this.listCard[0].child[2].mark=res.data.mdcInstitutionAddress
						this.listCard[1].child[0].mark=res.data.infectionBarrelsCount
						this.listCard[1].child[1].mark=res.data.infectionGrossWeight
						this.listCard[1].child[2].mark=res.data.infectionNetWeight
						this.listCard[2].child[0].mark=res.data.sharpsBarrelsCount
						this.listCard[2].child[1].mark=res.data.sharpsGrossWeight
						this.listCard[2].child[2].mark=res.data.sharpsNetWeight
						this.jjr=res.data.transferPerson
						this.total = res.data.totalWasteNetWeight
				}).catch(err => {
					uni.$u.toast('获取详情信息失败!')
				})
			}, 200)
		},
		methods: {
			edict(item) {
				uni.navigateTo({
					url: `/pages/Receivingedict/Receivingedict?id=${this.cardId}&edict=true`
				})
			},
			remove() {
				let self = this
				uni.showModal({
					title: '提示',
					content: '确定作废当前数据？',
					success: (res) => {
						if (res.confirm) {
							invalid({
								id:this.cardId
							}).then(res => {
								// self.logList()
								uni.$u.toast('作废成功!')
								setTimeout(()=>{
									uni.navigateBack()
								}, 1500)
							}).catch(err => {
								// uni.$u.toast('作废失败!')
							})
							// 用户点击了确定，执行相应的逻辑
						}
					}
				});
			},
			
		}
	}
</script>

<style scoped lang="less">
	.qianzBox{
		width: 100%;
		margin-bottom: 20rpx;
		background-color: #fff;
		padding: 0 30rpx;
		box-sizing: border-box;
		.tit{
			font-size: 30rpx;
			font-weight: bold;
			color: #333;
			height: 80rpx;
			line-height: 80rpx;
		}
		.qzImg{
			width: 100%;
			padding-top: 10rpx;
			padding-bottom: 30rpx;
			image{
				width: 200rpx;
				height: 200rpx;
				border-radius: 6rpx;
			}
		}
	}
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;

	}

	.edict-button {
		display: flex;
		justify-content: flex-end;
		gap: 20rpx
	}

	.head {
		width: 750rpx;
		height: 276rpx;
		position: fixed;
		top: 0;
		z-index: 1;
		background: url(@/static/sy.png) no-repeat;
		background-size: contain;
	}
  /deep/ .filecard{
padding-left: 0rpx !important;
    }
	.soltValue {
		text-align: right;

		.total {
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC-Semibold;
			font-weight: Semibold;
			text-align: right;
			color: #333333;
			padding: 20rpx 0;

			span {
				font-size: 40rpx;
			}
		}

	}

	.cardtop {
		position: relative;
		top: -20rpx;

	}

	.fouter {
		display: flex;
		gap: 20rpx;
		justify-content: center;
		margin-bottom: 40rpx;
		padding: 0 20rpx;
		padding-bottom: 40rpx;
		box-sizing: border-box;
		.zuofei{
			width: 100%;
			height: 90rpx;
			border: 2rpx solid #b3b3b3;
			border-radius: 10rpx;
			font-size: 30rpx;
			color: #999999;
		}
		.bianji{
			width: 490rpx;
			height: 90rpx;
			background: #3db020;
			border-radius: 10rpx;
			font-size: 30rpx;
			color: #fff;
		}
	}

	.time{
		font-size: 26rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: Regular;
		text-align: right;
		color: #999999;
		position: absolute;
		top: 26rpx;
		left: 470rpx;
	}
</style>